
<template>
	<view class="card">
         <view class="card_header">
         	<view class="title">
         		<up-text :lines="2" :text="props.title"></up-text>
         	</view>
			<view class="price">
				<up-text type="error" mode="price" :text="props.price" size="18px"></up-text>
				<view class="numClass">
					<up-text type="success" mode="text" text="库存:" size="12px" style="flex: 1;"></up-text>
					<up-text type="success" mode="text" :text="props.num" size="12px" style="flex:2"></up-text>
				</view>
				
			</view>
         </view>
		 <up-line color="#ff0000"></up-line>
		 <view class="card_foot">
		 	<view class="my_offer">
                <view class="offer_price" >
                    <view  style="margin-right: 4px; "><up-tag text="报价:" size="mini"></up-tag></view>
				<up-text :text="'￥'+props.otherPrice" size="13" style="margin-left: 3px;width: 73px;"></up-text>
                </view>
				<view class="offer_num" >
                    <view  style="margin-right: 4px; "><up-tag text="数量:" size="mini"></up-tag></view>
                    <up-text :text="+props.otherNum" size="13" style="margin-left: 3px;width: 73px;"></up-text>
                </view>
               
		 	</view>
			<view class="btn_offer">
				<up-button text="接受" icon="bell" type="success" @click="onConfirm" style="margin-right: 13px;" ></up-button>
                <up-button text="拒绝" icon="bell" type="error" @click="onConfuse"></up-button>
			</view>
		 </view>
	</view>
</template>

<script setup lang="ts">
	import { http } from '@/utils/http';
import type { OhterOfferProps} from '@/utils/page_types'
    const props = defineProps<OhterOfferProps>()
   // "offerId":97677803129933824,
   // "infoId":82335508105007104,
   // "status":1,
   // "dealUser":"testOpenID",
   // "offerPrice":999.00,
   // "offerNum":1,
//"offerUser":"testOpenID2"
	const onConfirm =async ()=>{
		const data=await http<null>({
		url:"/offer",
		data:{
			offerId:props.offerId,
			infoId:props.infoId,
			status:2,
			dealUser:props.dealUser,
			offerPrice:parseFloat(props.otherPrice) ,
			offerNum:parseInt( props.otherNum),
			offerUser:props.offerUser
		},
		method:"PUT"
	 });
	  if(data.code==1000){
		props.initList()
	  }
	}

    const onConfuse=async ()=>{
		const data=await http<null>({
		url:"/offer",
		data:{
			offerId:props.offerId,
			infoId:props.infoId,
			status:1,
			dealUser:props.dealUser,
			offerPrice:parseFloat(props.otherPrice),
			offerNum:parseInt( props.otherNum),
			offerUser:props.offerUser
		},
		method:"PUT"
	 });
	  if(data.code==1000){
		props.initList()
	  }
    }

</script>

<style scoped>
  .card{
	  display: flex;
	  flex-direction: column;
	  width: 95%;
	  height: 140px;
	  background-color: white;
	  border-radius: 6px;
	  margin: 5px auto;
	  border: 1px solid #c8c7cc;
  } 
  .card_header{
	  display: flex;
	  justify-content: space-between;
	  height: 80px;
	  align-items: center;
	  padding-left: 18px;
	  padding-right: 18px;
  }
  .title{
	  width: 70%;
	  margin-right: 8px;
  }
  .price{
	  width: 30%;
	  color: red;
	  text-align: center;
	  font-weight: bold;
	  margin-left: 10px;
  }
  .card_foot{
	  height: 60px;
	  display: flex;
	  align-items: center;
	  margin: 1px 8px;
	  justify-content: space-around;
  }
  .my_offer{
	  display: flex;
      flex-direction: column;

  }
  .btn_offer{
    display: flex;
  }

  .numClass{
	  margin-top: 4px;
	  display: flex;
  }
  .offer_price{
    display: flex;
  }
  .offer_num{
    display: flex;
    margin-top: 5px;
  }
</style>